<!DOCTYPE html>
<html>
<link href="../static/bootstrap.min.css" rel="stylesheet">
<link href="../static/starter-template.css" rel="stylesheet">
<script>
function changeColor(idd) { 
	var allChanges = "";
	//alert(idd);
	var id = document.getElementById(idd);
	var before = id.innerHTML;
	var courseNameEle =document.getElementById(id.id+"coursename");
	var courseName = courseNameEle.value;
	var courseIdEle = document.getElementById(id.id+"courseid");
	var courseId = courseIdEle.value;
	var creditsEle = document.getElementById(id.id+"coursecredits");  
	var credits = creditsEle.options[creditsEle.selectedIndex].value;
	var gradeEle = document.getElementById(id.id+"sel");   		   		
	var grade = gradeEle.options[gradeEle.selectedIndex].value;   				 

	// if (grade === null || grade === false) { id.innerHTML = before; }
 //    if (grade === "") { id.innerHTML = before; }
 // 	else 
 // 	{ 
 // 		document.getElementById(id.id+"Info").innerHTML = courseName + "<p></p>" 
 // 		+ courseId + "<p></p>" + credits + " Credits" + "<p></p>" + "Your grade is: " + grade;     		
 //    	//id.style.backgroundColor="#a2edb1";
 //    }

    var taken = true;
    if (grade === "Did not Take")
    {
    	taken = false; //alert("did not take");
    	id.style.backgroundColor="#ffffff";
    	document.getElementById(id.id+"Info").innerHTML = courseName + "<p></p>" 
 		+ courseId + "<p></p>" + credits + " Credits" + "<p></p>" + "Your grade is: " + grade;  
    }
    else
    {
    	//if (id.style.backgroundColor == "rgb(162, 237, 177)") 
    	id.style.backgroundColor="#a2edb1"; //alert("take");
    	document.getElementById(id.id+"Info").innerHTML = courseName + "<p></p>" 
 		+ courseId + "<p></p>" + credits + " Credits" + "<p></p>" + "Your grade is: " + grade;    	
    }

	var allChanges = 'cellnumber='+parseInt(id.id)+'&coursetaken='+Boolean(taken)+'&coursename='+String(courseName)+
	"&courseid="+String(courseId)+"&credits="+parseInt(credits, 10)+"&grade="+String(grade);
	//alert(taken);
	var request = new XMLHttpRequest();	
	request.open("POST","/main",true);
	request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
	request.send(allChanges);
}
</script>
<link href="../static/bootstrap.min.css" rel="stylesheet">
<link href="../static/starter-template.css" rel="stylesheet">

<div class="CSSTableGenerator">

	<table border="1" width ="100%" >
	<tr>
		<td>Semester #1<br>Freshman 1</td>
		<td>Semester #2<br>Freshman 2</td>
		<td>Semester #3<br>Sophomore 1</td>
		<td>Semester #4<br>Sophomore 2</td>
		<td>Semester #5<br>Junior 1</td>
		<td>Semester #6<br>Junior 2</td>
		<td>Semester #7<br>Senior 1</td>
		<td>Semester #8<br>Senior 2</td>
	</tr>
	<tr>
		<td style="background-color:{{classTaken.0}}" id = "0" {{classTaken.0}}>
			<div style="display: inline;" id="0Info">{{courseNames.0}} <br><br> {{courseId.0}} <br><br> {{courseCredits.0}} Credits <br><br> Your grade is: {{courseGrades.0}}</div>
			<a href="#" data-toggle="modal" data-target="#0modal"></a></td>
		<td style="background-color:{{classTaken.5}}" id = "5" {{classTaken.5}}>
			<div style="display: inline;" id="5Info">{{courseNames.5}} <br><br> {{courseId.5}} <br><br> {{courseCredits.5}} Credits <br><br> Your grade is: {{courseGrades.5}}</div>			
			<a href="#" data-toggle="modal" data-target="#5modal"></a></td>
		<td style="background-color:{{classTaken.10}}" id = "10" {{classTaken.10}}>
			<div style="display: inline;" id="10Info">{{courseNames.10}} <br><br> {{courseId.10}} <br><br> {{courseCredits.10}} Credits <br><br> Your grade is: {{courseGrades.10}}</div>			
			<a href="#" data-toggle="modal" data-target="#10modal"></a></td>			
		<td style="background-color:{{classTaken.15}}" id = "15" {{classTaken.15}}>
			<div style="display: inline;" id="15Info">{{courseNames.15}} <br><br> {{courseId.15}} <br><br> {{courseCredits.15}} Credits <br><br> Your grade is: {{courseGrades.15}}</div>			
			<a href="#" data-toggle="modal" data-target="#15modal"></a></td>	
		<td style="background-color:{{classTaken.20}}" id = "20" {{classTaken.20}}>
			<div style="display: inline;" id="20Info">{{courseNames.20}} <br><br> {{courseId.20}} <br><br> {{courseCredits.20}} Credits <br><br> Your grade is: {{courseGrades.20}}</div>			
			<a href="#" data-toggle="modal" data-target="#20modal"></a></td>
		<td style="background-color:{{classTaken.25}}" id = "25" {{classTaken.25}}>
			<div style="display: inline;" id="25Info">{{courseNames.25}} <br><br> {{courseId.25}} <br><br> {{courseCredits.25}} Credits <br><br> Your grade is: {{courseGrades.25}}</div>			
			<a href="#" data-toggle="modal" data-target="#25modal"></a></td>
		<td style="background-color:{{classTaken.30}}" id = "30" {{classTaken.30}}>
			<div style="display: inline;" id="30Info">{{courseNames.30}} <br><br> {{courseId.30}} <br><br> {{courseCredits.30}} Credits <br><br> Your grade is: {{courseGrades.30}}</div>			
			<a href="#" data-toggle="modal" data-target="#30modal"></a></td>
		<td style="background-color:{{classTaken.35}}" id = "35" {{classTaken.35}}>
			<div style="display: inline;" id="35Info">{{courseNames.35}} <br><br> {{courseId.35}} <br><br> {{courseCredits.35}} Credits <br><br> Your grade is: {{courseGrades.35}}</div>			
			<a href="#" data-toggle="modal" data-target="#35modal"></a></td>
	</tr>
	<tr>
		<td style="background-color:{{classTaken.1}}" id = "1" {{classTaken.1}}>
			<div style="display: inline;" id="1Info">{{courseNames.1}} <br><br> {{courseId.1}} <br><br> {{courseCredits.1}} Credits <br><br> Your grade is: {{courseGrades.1}}</div>			
			<a href="#" data-toggle="modal" data-target="#1modal"></a></td>
		<td style="background-color:{{classTaken.6}}" id = "6" {{classTaken.6}}>
			<div style="display: inline;" id="6Info">{{courseNames.6}} <br><br> {{courseId.6}} <br><br> {{courseCredits.6}} Credits <br><br> Your grade is: {{courseGrades.6}}</div>			
			<a href="#" data-toggle="modal" data-target="#6modal"></a></td>
		<td style="background-color:{{classTaken.11}}" id = "11" {{classTaken.11}}>
			<div style="display: inline;" id="11Info">{{courseNames.11}} <br><br> {{courseId.11}} <br><br> {{courseCredits.11}} Credits <br><br> Your grade is: {{courseGrades.11}}</div>			
			<a href="#" data-toggle="modal" data-target="#11modal"></a></td>
		<td style="background-color:{{classTaken.16}}" id = "16" {{classTaken.16}}>
			<div style="display: inline;" id="16Info">{{courseNames.16}} <br><br> {{courseId.16}} <br><br> {{courseCredits.16}} Credits <br><br> Your grade is: {{courseGrades.16}}</div>			
			<a href="#" data-toggle="modal" data-target="#16modal"></a></td>
		<td style="background-color:{{classTaken.21}}" id = "21" {{classTaken.21}}>
			<div style="display: inline;" id="21Info">{{courseNames.21}} <br><br> {{courseId.21}} <br><br> {{courseCredits.21}} Credits <br><br> Your grade is: {{courseGrades.21}}</div>			
			<a href="#" data-toggle="modal" data-target="#21modal"></a></td>
		<td style="background-color:{{classTaken.26}}" id = "26" {{classTaken.26}}>
			<div style="display: inline;" id="26Info">{{courseNames.26}} <br><br> {{courseId.26}} <br><br> {{courseCredits.26}} Credits <br><br> Your grade is: {{courseGrades.26}}</div>			
			<a href="#" data-toggle="modal" data-target="#26modal"></a></td>
		<td style="background-color:{{classTaken.31}}" id = "31" {{classTaken.31}}>
			<div style="display: inline;" id="31Info">{{courseNames.31}} <br><br> {{courseId.31}} <br><br> {{courseCredits.31}} Credits <br><br> Your grade is: {{courseGrades.31}}</div>			
			<a href="#" data-toggle="modal" data-target="#31modal"></a></td>
		<td style="background-color:{{classTaken.36}}" id = "36" {{classTaken.36}}>
			<div style="display: inline;" id="36Info">{{courseNames.36}} <br><br> {{courseId.36}} <br><br> {{courseCredits.36}} Credits <br><br> Your grade is: {{courseGrades.36}}</div>			
			<a href="#" data-toggle="modal" data-target="#36modal"></a></td>
	</tr>
	<tr>
		<td style="background-color:{{classTaken.2}}" id = "2" {{classTaken.2}}>
			<div style="display: inline;" id="2Info">{{courseNames.2}} <br><br> {{courseId.2}} <br><br> {{courseCredits.2}} Credits <br><br> Your grade is: {{courseGrades.2}}</div>
			<a href="#" data-toggle="modal" data-target="#2modal"></a></td>
		<td style="background-color:{{classTaken.7}}" id = "7" {{classTaken.7}}>
			<div style="display: inline;" id="7Info">{{courseNames.7}} <br><br> {{courseId.7}} <br><br> {{courseCredits.7}} Credits <br><br> Your grade is: {{courseGrades.7}}</div>
			<a href="#" data-toggle="modal" data-target="#7modal"></a></td>
		<td style="background-color:{{classTaken.12}}" id = "12" {{classTaken.12}}>
			<div style="display: inline;" id="12Info">{{courseNames.12}} <br><br> {{courseId.12}} <br><br> {{courseCredits.12}} Credits <br><br> Your grade is: {{courseGrades.12}}</div>
			<a href="#" data-toggle="modal" data-target="#12modal"></a></td>
		<td style="background-color:{{classTaken.17}}" id = "17" {{classTaken.17}}>
			<div style="display: inline;" id="17Info">{{courseNames.17}} <br><br> {{courseId.17}} <br><br> {{courseCredits.17}} Credits <br><br> Your grade is: {{courseGrades.17}}</div>
			<a href="#" data-toggle="modal" data-target="#17modal"></a></td>
		<td style="background-color:{{classTaken.22}}" id = "22" {{classTaken.22}}>
			<div style="display: inline;" id="22Info">{{courseNames.22}} <br><br> {{courseId.22}} <br><br> {{courseCredits.22}} Credits <br><br> Your grade is: {{courseGrades.22}}</div>
			<a href="#" data-toggle="modal" data-target="#22modal"></a></td>
		<td style="background-color:{{classTaken.27}}" id = "27" {{classTaken.27}}>
			<div style="display: inline;" id="27Info">{{courseNames.27}} <br><br> {{courseId.27}} <br><br> {{courseCredits.27}} Credits <br><br> Your grade is: {{courseGrades.27}}</div>
			<a href="#" data-toggle="modal" data-target="#27modal"></a></td>
		<td style="background-color:{{classTaken.32}}" id = "32" {{classTaken.32}}>
			<div style="display: inline;" id="32Info">{{courseNames.32}} <br><br> {{courseId.32}} <br><br> {{courseCredits.32}} Credits <br><br> Your grade is: {{courseGrades.32}}</div>
			<a href="#" data-toggle="modal" data-target="#32modal"></a></td>
		<td style="background-color:{{classTaken.37}}" id = "37" {{classTaken.37}}>
			<div style="display: inline;" id="37Info">{{courseNames.37}} <br><br> {{courseId.37}} <br><br> {{courseCredits.37}} Credits <br><br> Your grade is: {{courseGrades.37}}</div>
			<a href="#" data-toggle="modal" data-target="#37modal"></a></td>
	</tr>
	<tr>
		<td style="background-color:{{classTaken.3}}" id = "3" {{classTaken.3}}>
			<div style="display: inline;" id="3Info">{{courseNames.3}} <br><br> {{courseId.3}} <br><br> {{courseCredits.3}} Credits <br><br> Your grade is: {{courseGrades.3}}</div>
			<a href="#" data-toggle="modal" data-target="#3modal"></a></td>
		<td style="background-color:{{classTaken.8}}" id = "8" {{classTaken.8}}>
			<div style="display: inline;" id="8Info">{{courseNames.8}} <br><br> {{courseId.8}} <br><br> {{courseCredits.8}} Credits <br><br> Your grade is: {{courseGrades.8}}</div>
			<a href="#" data-toggle="modal" data-target="#8modal"></a></td>
		<td style="background-color:{{classTaken.13}}" id = "13" {{classTaken.13}}>
			<div style="display: inline;" id="13Info">{{courseNames.13}} <br><br> {{courseId.13}} <br><br> {{courseCredits.13}} Credits <br><br> Your grade is: {{courseGrades.13}}</div>
			<a href="#" data-toggle="modal" data-target="#13modal"></a></td>
		<td style="background-color:{{classTaken.18}}" id = "18" {{classTaken.18}}>
			<div style="display: inline;" id="18Info">{{courseNames.18}} <br><br> {{courseId.18}} <br><br> {{courseCredits.18}} Credits <br><br> Your grade is: {{courseGrades.18}}</div>
			<a href="#" data-toggle="modal" data-target="#18modal"></a></td>
		<td style="background-color:{{classTaken.23}}" id = "23" {{classTaken.23}}>
			<div style="display: inline;" id="23Info">{{courseNames.23}} <br><br> {{courseId.23}} <br><br> {{courseCredits.23}} Credits <br><br> Your grade is: {{courseGrades.23}}</div>
			<a href="#" data-toggle="modal" data-target="#23modal"></a></td>
		<td style="background-color:{{classTaken.28}}" id = "28" {{classTaken.28}}>
			<div style="display: inline;" id="28Info">{{courseNames.28}} <br><br> {{courseId.28}} <br><br> {{courseCredits.28}} Credits <br><br> Your grade is: {{courseGrades.28}}</div>
			<a href="#" data-toggle="modal" data-target="#28modal"></a></td>
		<td style="background-color:{{classTaken.33}}" id = "33" {{classTaken.33}}>
			<div style="display: inline;" id="33Info">{{courseNames.33}} <br><br> {{courseId.33}} <br><br> {{courseCredits.33}} Credits <br><br> Your grade is: {{courseGrades.33}}</div>
			<a href="#" data-toggle="modal" data-target="#33modal"></a></td>
		<td style="background-color:{{classTaken.38}}" id = "38" {{classTaken.38}}>
			<div style="display: inline;" id="38Info">{{courseNames.38}} <br><br> {{courseId.38}} <br><br> {{courseCredits.38}} Credits <br><br> Your grade is: {{courseGrades.38}}</div>
			<a href="#" data-toggle="modal" data-target="#38modal"></a></td>
	</tr>
	<tr>
		<td style="background-color:{{classTaken.4}}" id = "4" {{classTaken.4}}>
			<div style="display: inline;" id="4Info">{{courseNames.4}} <br><br> {{courseId.4}} <br><br> {{courseCredits.4}} Credits <br><br> Your grade is: {{courseGrades.4}}</div>
			<a href="#" data-toggle="modal" data-target="#4modal"></a></td>
		<td style="background-color:{{classTaken.9}}" id = "9" {{classTaken.9}}>
			<div style="display: inline;" id="9Info">{{courseNames.9}} <br><br> {{courseId.9}} <br><br> {{courseCredits.9}} Credits <br><br> Your grade is: {{courseGrades.9}}</div>
			<a href="#" data-toggle="modal" data-target="#9modal"></a></td>
		<td style="background-color:{{classTaken.14}}" id = "14" {{classTaken.14}}>
			<div style="display: inline;" id="14Info">{{courseNames.14}} <br><br> {{courseId.14}} <br><br> {{courseCredits.14}} Credits <br><br> Your grade is: {{courseGrades.14}}</div>
			<a href="#" data-toggle="modal" data-target="#14modal"></a></td>
		<td style="background-color:{{classTaken.19}}" id = "19" {{classTaken.19}}>
			<div style="display: inline;" id="19Info">{{courseNames.19}} <br><br> {{courseId.19}} <br><br> {{courseCredits.19}} Credits <br><br> Your grade is: {{courseGrades.19}}</div>
			<a href="#" data-toggle="modal" data-target="#19modal"></a></td>
		<td style="background-color:{{classTaken.24}}" id = "24" {{classTaken.24}}>
			<div style="display: inline;" id="24Info">{{courseNames.24}} <br><br> {{courseId.24}} <br><br> {{courseCredits.24}} Credits <br><br> Your grade is: {{courseGrades.24}}</div>
			<a href="#" data-toggle="modal" data-target="#24modal"></a></td>
		<td style="background-color:{{classTaken.29}}" id = "29" {{classTaken.29}}>
			<div style="display: inline;" id="29Info">{{courseNames.29}} <br><br> {{courseId.29}} <br><br> {{courseCredits.29}} Credits <br><br> Your grade is: {{courseGrades.29}}</div>
			<a href="#" data-toggle="modal" data-target="#29modal"></a></td>
		<td style="background-color:{{classTaken.34}}" id = "34" {{classTaken.34}}>
			<div style="display: inline;" id="34Info">{{courseNames.34}} <br><br> {{courseId.34}} <br><br> {{courseCredits.34}} Credits <br><br> Your grade is: {{courseGrades.34}}</div>
			<a href="#" data-toggle="modal" data-target="#34modal"></a></td>
		<td style="background-color:{{classTaken.39}}" id = "39" {{classTaken.39}}>
			<div style="display: inline;" id="39Info">{{courseNames.39}} <br><br> {{courseId.39}} <br><br> {{courseCredits.39}} Credits <br><br> Your grade is: {{courseGrades.39}}</div>
			<a href="#" data-toggle="modal" data-target="#39modal"></a></td>
	</tr>
</table>

    <div class="modal fade" id="0modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "0coursename" value="{{courseNames.0}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "0courseid" value="{{courseId.0}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "0coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "0sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('0')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="1modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "1coursename" value="{{courseNames.1}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "1courseid" value="{{courseId.1}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "1coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "1sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('1')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="2modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "2coursename" value="{{courseNames.2}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "2courseid" value="{{courseId.2}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "2coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "2sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('2')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="3modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "3coursename" value="{{courseNames.3}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "3courseid" value="{{courseId.3}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "3coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "3sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('3')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>

    
<div class="modal fade" id="4modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "4coursename" value="{{courseNames.4}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "4courseid" value="{{courseId.4}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "4coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "4sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('4')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="5modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "5coursename" value="{{courseNames.5}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "5courseid" value="{{courseId.5}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "5coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "5sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('5')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>

 

<div class="modal fade" id="6modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "6coursename" value="{{courseNames.6}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "6courseid" value="{{courseId.6}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "6coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "6sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('6')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


<div class="modal fade" id="7modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "7coursename" value="{{courseNames.7}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "7courseid" value="{{courseId.7}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "7coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "7sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('7')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>



	<div class="modal fade" id="8modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "8coursename" value="{{courseNames.8}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "8courseid" value="{{courseId.8}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "8coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "8sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('8')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>

	<div class="modal fade" id="9modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "9coursename" value="{{courseNames.9}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "9courseid" value="{{courseId.9}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "9coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "9sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('9')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<!--  -->
<!--  -->
<!--  -->


<div class="modal fade" id="10modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "10coursename" value="{{courseNames.10}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "10courseid" value="{{courseId.10}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "10coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "10sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('10')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="11modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "11coursename" value="{{courseNames.11}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "11courseid" value="{{courseId.11}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "11coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "11sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('11')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="12modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "12coursename" value="{{courseNames.12}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "12courseid" value="{{courseId.12}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "12coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "12sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('12')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="13modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "13coursename" value="{{courseNames.13}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "13courseid" value="{{courseId.13}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "13coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "13sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('13')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>

    
<div class="modal fade" id="14modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "14coursename" value="{{courseNames.14}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "14courseid" value="{{courseId.14}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "14coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "14sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('14')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="15modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "15coursename" value="{{courseNames.15}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "15courseid" value="{{courseId.15}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "15coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "15sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('15')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>

 

<div class="modal fade" id="16modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "16coursename" value="{{courseNames.16}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "16courseid" value="{{courseId.16}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "16coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "16sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('16')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


<div class="modal fade" id="17modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "17coursename" value="{{courseNames.17}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "17courseid" value="{{courseId.17}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "17coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "17sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('17')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>



	<div class="modal fade" id="18modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "18coursename" value="{{courseNames.18}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "18courseid" value="{{courseId.18}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "18coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "18sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('18')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>

	<div class="modal fade" id="19modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "19coursename" value="{{courseNames.19}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "19courseid" value="{{courseId.19}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "19coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "19sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('19')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>



<!--  -->
<!--  -->
<!--  -->




<div class="modal fade" id="20modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "20coursename" value="{{courseNames.20}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "20courseid" value="{{courseId.20}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "20coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "20sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('20')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="21modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "21coursename" value="{{courseNames.21}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "21courseid" value="{{courseId.21}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "21coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "21sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('21')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="22modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "22coursename" value="{{courseNames.22}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "22courseid" value="{{courseId.22}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "22coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "22sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('22')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="23modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "23coursename" value="{{courseNames.23}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "23courseid" value="{{courseId.23}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "23coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "23sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('23')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>

    
<div class="modal fade" id="24modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "24coursename" value="{{courseNames.24}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "24courseid" value="{{courseId.24}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "24coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "24sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('24')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="25modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "25coursename" value="{{courseNames.25}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "25courseid" value="{{courseId.25}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "25coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "25sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('25')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>

 

<div class="modal fade" id="26modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "26coursename" value="{{courseNames.26}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "26courseid" value="{{courseId.26}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "26coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "26sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('26')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


<div class="modal fade" id="27modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "27coursename" value="{{courseNames.27}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "27courseid" value="{{courseId.27}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "27coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "27sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('27')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>



	<div class="modal fade" id="28modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "28coursename" value="{{courseNames.28}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "28courseid" value="{{courseId.28}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "28coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "28sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('28')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>

	<div class="modal fade" id="29modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "29coursename" value="{{courseNames.29}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "29courseid" value="{{courseId.29}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "29coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "29sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('29')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>



<!--  -->
<!--  -->
<!--  -->


<div class="modal fade" id="30modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "30coursename" value="{{courseNames.30}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "30courseid" value="{{courseId.30}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "30coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "30sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('30')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="31modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "31coursename" value="{{courseNames.31}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "31courseid" value="{{courseId.31}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "31coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "31sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('31')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="32modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "32coursename" value="{{courseNames.32}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "32courseid" value="{{courseId.32}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "32coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "32sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('32')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="33modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "33coursename" value="{{courseNames.33}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "33courseid" value="{{courseId.33}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "33coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "33sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('33')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>

    
<div class="modal fade" id="34modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "34coursename" value="{{courseNames.34}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "34courseid" value="{{courseId.34}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "34coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "34sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('34')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


	<div class="modal fade" id="35modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "35coursename" value="{{courseNames.35}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "35courseid" value="{{courseId.35}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "35coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "35sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('35')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>

 

<div class="modal fade" id="36modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "36coursename" value="{{courseNames.36}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "36courseid" value="{{courseId.36}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "36coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "36sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('36')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>


<div class="modal fade" id="37modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "37coursename" value="{{courseNames.37}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "37courseid" value="{{courseId.37}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "37coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "37sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('37')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>



	<div class="modal fade" id="38modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "38coursename" value="{{courseNames.38}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "38courseid" value="{{courseId.38}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "38coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "38sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('38')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>

	<div class="modal fade" id="39modal" tabindex="-1" role="dialog" aria-labelledby="smallModal" aria-hidden="true">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">          
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">Update Class Information</h4>
          </div>          
          <div class="modal-body">
          	<table>
          		<tr>
          			<td>
          				Entry
          			</td>
          			<td>
          				Value
          			</td>
          		</tr>
      			<tr>
      				<td>
      				Course Name:
      				</td>
      				<td>
      					<input id = "39coursename" value="{{courseNames.39}}" />
      				</td>
      			</tr>
      			<tr>
      				<td>
      				Course ID:
      				</td>
      				<td>
      					<input id = "39courseid" value="{{courseId.39}}" />
      				</td>
      			</tr>         			   
      			<tr>
      				<td>
      				Credits:
      				</td>
      				<td>
      					<select id = "39coursecredits">
          					<option>1</option>
          					<option>2</option>
			          		<option>3</option>
          					<option>4</option>
     			     		<option>5</option>
      					</select>
      				</td>
      			</tr>
          		<tr>
          			<td>
          			Grade:
          			</td>
          			<td>
      					<select id = "39sel">
          					<option>A+</option>
          					<option>A</option>
			          		<option>A-</option>
          					<option>B+</option>
     			     		<option>B</option>
    			      		<option>B-</option>
    			      		<option>C+</option>
    			      		<option>C</option>
    			      		<option>C-</option>
          					<option>D+</option>
      			    		<option>D</option>
          					<option>D-</option>
          					<option>F</option>
          					<option>Did not Take</option>
      					</select>
      				</td>
      			</tr>   		
      		
      		</table>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button onclick="changeColor('39')" type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
          </div>
        </div>
      </div>
    </div>
	</div>



<!--  -->
<!--  -->
<!--  -->



    <script src="https://code.jquery.com/jquery.js"></script>
    <script src="../static/js/bootstrap.min.js"></script>
<style>
.CSSTableGenerator {
	margin:0px;padding:0px;
	width:100%;
	box-shadow: 10px 10px 5px #888888;
	border:1px solid #000000;
	
	-moz-border-radius-bottomleft:0px;
	-webkit-border-bottom-left-radius:0px;
	border-bottom-left-radius:0px;
	
	-moz-border-radius-bottomright:0px;
	-webkit-border-bottom-right-radius:0px;
	border-bottom-right-radius:0px;
	
	-moz-border-radius-topright:0px;
	-webkit-border-top-right-radius:0px;
	border-top-right-radius:0px;
	
	-moz-border-radius-topleft:0px;
	-webkit-border-top-left-radius:0px;
	border-top-left-radius:0px;
}.CSSTableGenerator table{
    border-collapse: collapse;
        border-spacing: 0;
	width:100%;
	height:100%;
	margin:0px;padding:0px;
}.CSSTableGenerator tr:last-child td:last-child {
	-moz-border-radius-bottomright:0px;
	-webkit-border-bottom-right-radius:0px;
	border-bottom-right-radius:0px;
	overflow: hidden;
}
.CSSTableGenerator table tr:first-child td:first-child {
	-moz-border-radius-topleft:0px;
	-webkit-border-top-left-radius:0px;
	border-top-left-radius:0px;
	overflow: hidden;
}
.CSSTableGenerator table tr:first-child td:last-child {
	-moz-border-radius-topright:0px;
	-webkit-border-top-right-radius:0px;
	border-top-right-radius:0px;
	overflow: hidden;
}.CSSTableGenerator tr:last-child td:first-child{
	-moz-border-radius-bottomleft:0px;
	-webkit-border-bottom-left-radius:0px;
	border-bottom-left-radius:0px;
	overflow: hidden;
}.CSSTableGenerator tr:hover td{
	
}
.CSSTableGenerator tr:nth-child(odd){ background-color:#ffffff; }
.CSSTableGenerator tr:nth-child(even)    { background-color:#ffffff; }.CSSTableGenerator td{
	vertical-align:middle;
	overflow: hidden;
	
	
	border:1px solid #000000;
	border-width:0px 1px 1px 0px;
	text-align:left;
	padding:7px;
	font-size:10px;
	font-family:Arial;
	font-weight:normal;
	color:#000000;
}.CSSTableGenerator tr:last-child td{
	overflow: hidden;
	border-width:0px 1px 0px 0px;
}.CSSTableGenerator tr td:last-child{
	overflow: hidden;
	border-width:0px 0px 1px 0px;
}.CSSTableGenerator tr:last-child td:last-child{
	overflow: hidden;
	border-width:0px 0px 0px 0px;
}
.CSSTableGenerator tr:first-child td{
	overflow: hidden;
		background:-o-linear-gradient(bottom, #005fbf 5%, #003f7f 100%);	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #003f7f) );
	background:-moz-linear-gradient( center top, #005fbf 5%, #003f7f 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#003f7f");	background: -o-linear-gradient(top,#005fbf,003f7f);

	background-color:#005fbf;
	border:0px solid #000000;
	text-align:center;
	border-width:0px 0px 1px 1px;
	font-size:14px;
	font-family:Arial;
	font-weight:bold;
	color:#ffffff;
}
.CSSTableGenerator tr:first-child:hover td{
	overflow: hidden;
	background:-o-linear-gradient(bottom, #005fbf 5%, #003f7f 100%);	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #003f7f) );
	background:-moz-linear-gradient( center top, #005fbf 5%, #003f7f 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#003f7f");	background: -o-linear-gradient(top,#005fbf,003f7f);

	background-color:#005fbf;
}
.CSSTableGenerator tr:first-child td:first-child{
	overflow: hidden;
	border-width:0px 0px 1px 0px;
}
.CSSTableGenerator tr:first-child td:last-child{

	border-width:0px 0px 1px 1px;
}
td a {
    display: block;
    margin: -10em;
    padding: 10em;
}

</style>